<%--
  Created by IntelliJ IDEA.
  LogInfo: XBB
  Date: 2021/2/18
  Time: 14:04
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/layui/css/layui.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/layui_ext/dtree/dtree.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/layui_ext/dtree/font/dtreefont.css">
</head>
<body>
<div style="padding: 10px">

    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
        <legend>查询条件</legend>
    </fieldset>
    <form  class="layui-form">
        <div class="layui-form-item">
            <div class="layui-form-item">
                <label class="layui-form-label">登录账号名</label>
                <div class="layui-input-inline">
                    <input type="text" name="loginName"   placeholder="请输入登录账号名" autocomplete="off" class="layui-input">
                </div>
                <label class="layui-form-label">登录IP地址</label>
                <div class="layui-input-inline">
                    <input type="text" name="loginIp"   placeholder="请输入登录IP地址" autocomplete="off" class="layui-input">
                </div>
                <label class="layui-form-label">登录时间</label>
                <div class="layui-input-inline">
                    <input type="text" name="loginTime"   placeholder="请输入登录时间" autocomplete="off" class="layui-input">
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">开始时间:</label>
                    <div class="layui-input-inline">
                        <input type="text" name="startTime" id="startTime" readonly="readonly"  autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">结束时间:</label>
                    <div class="layui-input-inline">
                        <input type="text" name="endTime"  id="endTime" readonly="readonly" autocomplete="off" class="layui-input">
                    </div>
                </div>
            </div>
            <div class="layui-form-item" style="text-align: right">
                <button  class="layui-btn layui-btn-normal layui-icon layui-icon-search layui-btn-radius layui-btn-sm" lay-submit lay-filter="doSearch">查询
                </button>
                <button type="reset" class="layui-btn layui-btn-warm layui-icon layui-icon-refresh layui-btn-radius layui-btn-sm">重置
                </button>
            </div>
        </div>
    </form>

    <table id="logInfoTable" lay-filter="logInfoTableFilter"></table>
</div>

<script id="toolbarlogInfo" type="text/html">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="deleteSome">批量删除</button>
    </div>
</script>

<script id="barlogInfo" type="text/html">
    <a class="layui-btn layui-btn-danger layui-btn-xs layui-btn-radius" lay-event="del">删除</a>
</script>

<script type="text/javascript" src="${pageContext.request.contextPath}/static/layui/layui.js"></script>
<script>

    var logInfoTab;
    var logInfoIndex;
    var title;

    layui.extend({
        dtree: '${pageContext.request.contextPath}/static/layui_ext/dtree/dtree'   //{/}代表采用自有路径
    }).use(['form','layer','jquery','table','dtree','laydate'],function() {
        var form = layui.form, layer = layui.layer, $ = layui.jquery,table = layui.table , dtree = layui.dtree,laydate=layui.laydate;

        laydate.render({
            elem:'#startTime',
            type:'datetime'
        });
        laydate.render({
            elem:'#endTime',
            type:'datetime'
        });

        logInfoTab = table.render({
            elem:"#logInfoTable"
            ,url:"${pageContext.request.contextPath}/sys/logInfo/logInfoRightJson"
            ,cols:[[
                {type:'checkbox'}
                ,{field:'id',title:'日志ID',align:"center",sort:true}
                ,{field:'loginName',title:'登录名称',align:"center"}
                ,{field:'loginIp',title:'登录IP',align:"center"}
                ,{field:'loginTime',title:'登录时间',align:"center"}
                ,{fixed:'right',title:'操作',align:"center",toolbar:'#barlogInfo',minWidth:250}
            ]]
            ,toolbar:'#toolbarlogInfo'
            ,page:true
            ,limit:[5,10,15]
            ,limit:5
        })

        //给查询按钮添加事件
        form.on('submit(doSearch)',function (data) {
            logInfoTab.reload({
                where:data.field
                ,page:{curr:1}
            })

            return false;
        })

        //监听头部工具栏
        table.on('toolbar(logInfoTableFilter)',function (obj) {
            if(obj.event == "deleteSome"){
                //获取选中的行
                var checkStatus = table.checkStatus(obj.config.id)
                if(checkStatus.data.length == 0){
                    layer.msg("至少选择一行数据")
                    return false
                }
                //获取所有选中的logInfoId
                var str = ""
                for(var i = 0;i<checkStatus.data.length;i++){
                    var logInfo = checkStatus.data[i];
                    str += logInfo.id + ","
                }
                deleteSome(str,checkStatus.data.length)
            }
        })

        function deleteSome(str,count) {
            layer.confirm("您确定要删除这"+count+"条数据吗？",{icon:2,title:'批量删除'},function(i){
                $.post("${pageContext.request.contextPath}/sys/logInfo/deleteSomeLogInfo",{"logInfoIds":str},function(r){
                    if(r.code == 0){
                        //删除成功
                        layer.msg(r.msg, {
                            offset: '15px'
                            ,icon: 1
                            ,time: 1000
                        }, function(){
                            // 刷新table
                            logInfoTab.reload({
                                page:{curr:1}
                            })
                        });
                    }else{
                        //删除失败
                        layer.msg(r.msg)
                    }
                })
            })
        }

        //监听行工具栏
        table.on('tool(logInfoTableFilter)',function (obj) {
            if(obj.event == "del"){
                del(obj.data)
            }
        })

        //点击删除
        function del(data){
            layer.confirm("确定删除该日志吗？",function (i) {
                $.post("${pageContext.request.contextPath}/sys/logInfo/logInfoDelete",{"id":data.id},function (r) {
                    if(r.code == 0){
                        layer.msg(r.msg,{
                            offset:'15px'
                            ,icon:1
                            ,time:1000
                        },function () {
                            //关闭当前弹出框
                            layer.close(logInfoIndex)
                            //刷新table
                            logInfoTab.reload({
                                page:{curr:1}
                            })
                        });
                    }else{
                        layer.msg(r.msg)
                    }

                })
            })
        }

    })
</script>
</body>
</html>

